package com.example.app.components


import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.CutCornerShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.Surface
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.example.app.R

@Composable
fun SurfaceSample() {
    // 可裁剪的容器
    // shape默认为矩形 CircleShape 胶囊 CutCornerShape 对每个角进行裁切 RoundedCornerShape 圆角
    // elevation抬高的阴影效果
    Surface(
        shape = CutCornerShape(30.dp),
        modifier = Modifier.size(200.dp, 60.dp),
        color = Color.Red,
        // brush设置渐变色
        border = BorderStroke(10.dp, Color.Blue),
        elevation = 20.dp
    ) {
        Image(painter = painterResource(id = R.drawable.a), contentDescription = null)
    }
}

@Preview(
    showSystemUi = true
)
@Composable
fun SurfacePreview() {
    SurfaceSample()
}

